$(function () {
    var uid = '6AFB6dCc-8996-E45E-9Fbd-A01D79bC7F63';
    // 请求热搜接口
    $.ajax({
        url: 'api.com',
        dataType: 'json',
        type: 'get'
    })
        .then(function (data){
            renderHot(data.data);
        })
        .catch(function (error){
            console.log(error);
        });
    // 渲染热搜
    function renderHot (hots) {
        for(var i = 0, htmlString = ''; i < hots.length; i++) {
            htmlString += '<span class="search-res__item'+ (hots[i].isHot ? " search-res__hot" : "") +'">'+ hots[i].tag +'</span>';
        }
        $('.search-res').append($(htmlString));
        $('.search-res__item').on('mousedown', function () {
            var self = this;
            var timer = setTimeout(function () {
                // your code
            }, 400);
            $(this).on('mouseup', function () {
                clearTimeout(timer);
            })
        })
    }
    // 渲染历史记录
    function renderHistoricRecords () {
        var records = getRecords(uid);
        for(var i = 0, htmlString = ''; i < records.length; i++) {
            htmlString += '<span class="search-rec__item">'+ records[i] +'</span>';
        }
        $('.search-rec').append($(htmlString));
    }
    renderHistoricRecords();
    // 查询历史搜索
    function getRecords (uid) {
        var storage = window.localStorage;
        var historicRecords = storage.getItem(uid) ? storage.getItem(uid).split(',') : [];
        return historicRecords;
    }
    // 设置历史记录
    function setRecords (uid, record) {
        var storage = window.localStorage;
        var historicRecords = storage.getItem(uid) ? storage.getItem(uid).split(',') : [];
        historicRecords.push(record);
        storage.setItem(uid, historicRecords);
    }
    //
    $('.search-icon__delete').click(function () {
        var $input = $('.search-input');
        if ($input.val() !== '') {
            // 发起搜索请求
            // $.ajax()
            setRecords(uid, $input.val());
        }
    })
});
